<template>
  <div class="main-container">
    <div class="bigTitle"><span>关于我们</span></div>
    <div class="video-container">
      <vue-core-video-player src="/media/1.mp4" title="大美横山 羊名天下" :volume="0.2" :muted="true" :loop="true" :autoplay="true" cover="/img/471710916218_.pic.jpg"/>
    </div>
    <div class="about_main">
      <div class="about_Content">
        <!-- 视频组件，播放media下面的1.mp4 -->
        
        
        <p> 巍巍横山，横亘千里；泱泱圁水，膏泽一方。牧羊史远，文化相续。衣皮啖肉，直溯秦汉之际；史记述载，北有戎狄之畜。凭地利，汲百草之精华，自古羊群塞道；占天时，饮万壑之琼浆，往来商贾不绝。令名彰著，获国家地理标志；品种优良，称陕北白绒山羊。</p>
        <p>横山羊肉，海内名传。高蛋白，肉质细嫩，肥瘦相间；低脂肪，味美无膻，香味浓郁。可补血之虚，称“陕北一绝”，风味独特；有益肾之气，誉“肉中人参”，功效非凡。究其原因，山川地理巧安排，饲草丰富育醇香。境内盛产地椒、碱韭、沙葱、香艾、苦菜、柴胡、甘草、黄芪、远志、苜蓿、沙打旺、蒲公英、草木樨、小型针茅等上百种香草及中草药，富含氨基酸、蛋白质及微生素，营养价值极高，堪为“中华肉类极品”。</p>
        <p>横山羊肉遗传基因好、屠宰年龄小、排酸较好、饲草多样、体重适中、运动量大、脂肪量低。横山羊肉甲天下的三大优势是挥发性脂肪酸含量低，不膻；维生素B2含量高，不上火；脂肪熔点高，食用不发胖。横山羊美名传天下的四大历史原因，水草肥美、沃野千里，有着悠久的养羊传统；干旱半干旱的气候，独特的地理位置；经人工选育培育，陕北白绒山羊品种优良；饲草丰富、营养均衡，孕育自然灵气，终成大自然的杰出馈赠；横山素有“千年古牧场，塞上小江南，独特好羊种，百草育醇香”的美誉。</p>
        <img src="/img/about1.jpg" alt="">
        <p>横山羊是浩繁历史的生动文献，是横山人与生俱来的文化基因，是横山人精神的心灵写照，是横山联农助农的鲜活勋章。陕北烹饪是文化、是科学、是艺术，“横山羊肉”更是其一大结晶，也是中国烹饪“以味道为核心，以营养为目的”这一本质特征的一大体现。纵贯古今，一方水土养一方人，横山人对羊有着特殊的情感，不断寻求创新灵感，探索饮食文化奥秘，分割全羊胴体，根据不同部位，选用炖、爆、焖、炒、煨等不同烹饪方式，做法繁多、调味考究，推出三大系列“横山羊”菜谱，包含家常系列、商务接待、高端国宴等50余种菜品的“全羊宴”。或炖，汤清味鲜；或烤，香溢不腻；或焖，醇香浓郁；或炒，鲜嫩滑润，给在人生旅途中的过客一份生活滋味。当谈及“横山羊”时，令人想象的画面是一道美味的佳肴、难忘的佳肴、留恋的佳肴，通过精心选料、精湛烹饪和独特的做法，展示陕北独特的饮食文化。2023年中国·中亚峰会上，芙蓉御宴，尽显神韵，横山羊肉飘香国宴，逐步走上了国际舞台，占据了中国名菜一席之地。</p>
        <img src="/img/about2.jpg" alt="">

        <p>改革开放以来，横山人镞砺括羽，奋辑笃行，大力发展羊产业，横山先后被命名为全国山羊板皮生产基地县、全国绒山羊标准化生产示范县、陕北白绒山羊育种基地县和主产区、陕西省特色农产品优势区、全国“一县一业”样板创建区县，一个个瞩目的成就诠释了“羊名天下”的全新内涵。2003年，农业部公布陕北白绒山羊为产绒为主、绒肉兼用型人工培育新品种，是继辽宁绒山羊、内蒙古绒山羊之后的第三个国审绒山羊品种之一。穿越时光，一句句信天游、一曲曲腰鼓舞、一段段说书、一张张剪纸、一篇篇美文，横山人将羊口口相传，吟诵至今。畜牧饶天下，文化承古今。继往开来，横山羊产业大数据中心因时顺势、应运而生，通过为白绒山羊嵌入唯一的ID号（电子身份证），实现产品追溯，建成统一监管、统一认证、统一规范的羊产品品控溯源体系，保证羊产品质量，让“横山羊”品牌成为陕西又一个世界知名农业品牌。</p>
        <img src="/img/about3.jpg" alt="">

        <p>岁稔时康，寓塞上以富饶；政通人和，期华夏之泰宁。品“横山羊”的美味，胜似一壶陈年佳酿，愈久弥香，回味无穷。</p>
      </div>
      <div class="map-container">
        <!-- 地图组件 -->
        <el-amap
          vid="amapContainer"
          :zoom="zoom"
          :events="events"
          class="map"
        ></el-amap>
      </div>
    </div>
    
    
  </div>
  


  
</template>
<script>
import { lazyAMapApiLoaderInstance } from "vue-amap";

export default  {
  name: 'AndexUs',
  data () {
    return {
      map: null, // 地图实例存储变量
      zoom: 13, // 地图缩放比例。zoom值越小，越宏观、越大，越微观。大家可以更改zoom值看看效果
      events: {}, // 地图事件
      // 高德地图逆编码
      // curl https://restapi.amap.com/v3/geocode/geo?address=陕西省榆林市横山区中环国际&output=XML&key=d168968d734f99cafc068628eee33731
      // 109.288042,37.961090
      x: 109.288042,
      y: 37.961090,
    }
  },
  mounted() {
    // 插件加载成功以后去绘制地图
    lazyAMapApiLoaderInstance.load().then(() => {
      // 指定地图容器，并做相应的配置
      this.map = new AMap.Map("amapContainer", {
        center: new AMap.LngLat(this.x, this.y), // 地图中心点的经纬度位置配置
        zoom: this.zoom, // 地图缩放比例配置
      });
      // 标记的配置
      var marker = new AMap.Marker({
        map: this.map, // 使用此地图实例
        icon: "https://webapi.amap.com/theme/v1.3/markers/n/mark_b.png", // 标记定位的小图标
        position: [this.x, this.y], // 标记定位的小图标经纬度位置（一般标记定位的位置和地图中心点的位置要保持一致）
      });
      // 使用相关配置
      marker.setMap(this.map);
    });
  },
}
</script>
<style>
.video-container {
  margin: 0 50px;
}
.play-pause-layer a svg rect {
  fill: #065b2b;
}
.play-pause-layer a svg path {
  fill: #065b2b;
}
.vcp-progress-played {
  background-color: #065b2b;
}
.map-container {
  display: block;
  width: 100%;
  height: 600px;
}
.map {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 1024px;
  height: 600px;
}
</style>
